<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <input type="button" value="ajax请求体参数" onclick="sendAjax()">
    <script>
       /*  
            请求体参数：http协议的规范，在请求报文具有请求体的类型(post、put)中，提供以报文内容作为载体的服务器参数发送方式
            html标签中，只能通过form标签发送post请求构建请求体参数 
        */

        function sendAjax(){
            let xhr=new XMLHttpRequest();
            
            xhr.open("post","/body");
            xhr.onload=function(){
               console.log(xhr.responseText);
            };

           /*  
            Content-Type：取值：
                text/plain;charset=UTF-8
                application/json;charset=UTF-8
                application/x-www-form-urlencoded
                multipart/form-data
            */

            // 告知服务器参数为普通文本请求以request payload传递
            // 设置为普通字符串格式:text/plain;charset=UTF-8，如果格式不符合要求，js会完成强制类型转换
            // 如果参数格式不是FormData构造函数创建的数据，text/plain将作为请求参数类型的默认值


            //告知服务器参数为JSON格式:application/json;charset=UTF-8,请求以request payload传递
            // 设置为JSON格式字符串，如果参数不符合要求，服务器将返回400错误请求
            // xhr.setRequestHeader("Content-Type","application/json;charset=UTF-8");

        /* 
            告知服务器为表单数据格式： application/x-www-form-urlencoded，请求以Form Data传递
                设置为表单参数：这类参数必须是使用urlencoded规则参数格式字符串
                urlencoded规则参数格式：请求查询参数的格式，参数名=参数值&参数名=参数值
                传递的参数将以上述格式作为转换依据进行参数分解
        */

            xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
            // let data="文本参数";
            // let data="[10,20,30]";
            // let data='{"name":"tom","age":20}';
            let data="name=cici&age=89&hobby=吃饭";


            //xhr.send(参数),参数格式只能接受string类型数据，如果参数类型不是string，会强制类型转换
            xhr.send(data);
        }
    </script>

    <form action="" enctype="application/x-www-form-urlencoded"></form>
</body>
</html>